import React from 'react'
import { REGISTER, LOGIN } from '../const/locations'
import { locationTo } from '../utils/LocationUtil'
import { LOGIN_IMG } from '../const/imgs'
class loginHeader extends React.Component {
  toRegister = () => {
    if (this.props.isLogin) {
      locationTo(REGISTER, '')

    }
  }
  toLogin = () => {
    if (!this.props.isLogin) {
      locationTo(LOGIN, '')
    }
  }
  render() {
    const { 
      // isLogin, 
      isForget } = this.props
    let HEIGHT = '150px'
    if (isForget) {
      HEIGHT = '100px'
    }
    return (
      <div style={{ ...styles.loginHeader, height: HEIGHT, }}>
        {/* <div style={styles.loginLogo} > */}
          <img src={LOGIN_IMG.LOGO.source.url}
            style={styles.loginLogo}
            alt='' 
          />
            {/* </div> */}
        <div style={styles.loginName}>
        </div>


      </div>
    )
  }
}

const styles = {
  loginHeader: {
    width: '100%',
    paddingTop: '50px',
    display: 'flex',
    flexDirection: 'column',
    justifyContent: 'center',
    alignItems: 'center'
  },
  loginName: {
    paddingBottom: '28px',
    fontSize: '22px',
  },
  loginLogo:{
    width: LOGIN_IMG.LOGO.property.width + 'px',
    height: LOGIN_IMG.LOGO.property.height + 'px',
  },
}

export default loginHeader;